<template>
  <div class="panel">
    <div class="hd">
      <h3>{{formDatas.formName}}</h3>
      <div class="edit">
        <button :class="editFlag?'his-btn':'edit-btn'"  @click="editFlag=!editFlag" ><span ><i class="glyphicon glyphicon-edit"></i>{{editFlag?'取消':''}}编辑</span></button>
      </div>
    </div>
    <div class="bd" v-loading="loading">
      <form-components :formDatas="formDatas" :editFlag.sync="editFlag" :params="{'xh':`${xh}`}"></form-components>
    </div>
  </div>
</template>

<script>
import FormComponents from "@/components/common/form/Form";
export default {
  name: "TypeRow",
  components: { FormComponents },
  data() {
    return {
      formDatas: [],
      editFlag: false,
      loading: true,
      xh: this.$route.query.xh
    };
  },
  created: function() {
    this.getData();
  },
  mounted: function() {
    this.$nextTick(function() {});
  },
  methods: {
    getData() {
      this.$http
        .get("/data/form/type-row.json", {
          params: {
            dataId: this.xh
          }
        })
        .then(res => {
          if (res.code === 0) {
            this.loading = false;
            this.formDatas = res.data;
            this.$emit("title", this.formDatas.formName);
          }
        });
    }
  }
};
</script>
<style lang="scss" scoped>
.jtcy-tit {
  border-bottom: none;
}
</style>
